<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition template="../template/index.xhtml"
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:c="http://java.sun.com/jsp/jstl/core">
	<ui:define name="lcontent">
		<ui:include src="/template/menu-left/human-resources.xhtml"></ui:include>
	</ui:define>
	<ui:define name="rcontent">	
		<f:event type="preRenderView" listener="#{designation.onload}"/>
		<span class="rtitle">Danh sách vị trí</span>
        <hr />
        <a class="button-link green-bt open-newDesignationDialog">
            + Thêm vị trí mới
        </a>
        <a class="button-link white-bt" id="openSearchButton">
            <img src="../resources/images/icons/search.png" alt="" />
        </a>
        <a class="button-link white-bt reload-btn">
            <img src="../resources/images/icons/refresh.png" alt="" />
        </a>
        <span class="clear"></span>
        
        <div id="searchPanel" class="search-panel none">
        	<h:form id="searchForm">
	        	<span class="search-panel-title">Tên vị trí</span>
	        	<h:inputText styleClass="input w80" value="#{designation.nameSearch}"></h:inputText>
	        	<span class="clear"></span>
	        	<h:commandButton value="Tìm kiếm" class="button white-bt" action="#{designation.search}">
	        	</h:commandButton>
	        	<span class="clear"></span>
        	</h:form>
        </div>
        <h:form id="resultForm">
	        <div class="list">
				<div class="nav-page-tp result-paging">
					Trang
					<h:selectOneMenu value="#{designation.currentPage}">
						<f:selectItems value="#{designation.pages}" ></f:selectItems>
					</h:selectOneMenu>
					<h:commandLink id="paging-click" styleClass="hide load" action="#{designation.paging}"></h:commandLink>
				</div>
				<span class="result-detail">Total 106 records. Showing 1 to 20</span>
				<ui:repeat var="var" value="#{designation.listDesignation}">
					<div class="list-item">
						<table>
							<tr>
								<td class="list-item-checked">
									<h:selectBooleanCheckbox styleClass="cbx">
									</h:selectBooleanCheckbox>
								</td>
								<td>
									<h:commandLink styleClass="list-item-click open-updateDesignationDialog"
										actionListener="#{designation.choose}">
										#{var.name}
										<f:ajax render=":formUpdateDesignation" />
										<f:attribute name="object" value="#{var}"></f:attribute>
									</h:commandLink>
									<br /> 
									<span class="clear"></span> 
									<span class="list-item-created">
									Được tạo bởi 
									<h:outputText value="#{var.created_by}"/> vào 
									<h:outputText value="#{var.created_date}">
										<f:convertDateTime pattern="dd/MM/yyyy hh:mm:ss"/>
									</h:outputText> 
									| Thay đổi bởi 
									<h:outputText value="#{var.modified_by}"/> vào 
									<h:outputText value="#{var.modified_date}">
										<f:convertDateTime pattern="dd/MM/yyyy hh:mm:ss"/>
									</h:outputText>
									</span>
								</td>
							</tr>
						</table>
					</div>
				</ui:repeat>	
			</div>
		</h:form>
        <span class="clear"></span>
        <div class="wrap-dialog none" id="newDesignationDialog">
			<div class="dialog">
				<span class="dialog-title">Thêm mới vị trí<b class="close-dialog">x</b></span>
				<div class="dialog-content">
					<h:form id="formNewDesignation">
					<table class="input-column w100">
						<tr>
							<td>
								<div class="input-item">
		        					<span class="block required">Tên vị trí <img align="top"
									src="#{facesContext.externalContext.requestContextPath}/resources/images/error.gif" /></span>
		        					<h:inputText styleClass="input w80" value="#{designation.designation.name}"
		        					maxlength="100" required="true" requiredMessage="Tên không được để trống"></h:inputText>
		        					<span class="italic block">Tên vị trí không được phép trùng nhau</span>
		        				</div>
							</td>
						</tr>
						<tr>
							<td><h:commandButton styleClass="button green-bt"
							action="#{designation.insert}" value="Tạo mới">
							</h:commandButton></td>
						</tr>
					</table>						
					</h:form>
				</div>
			</div>
		</div>
		
		<div class="wrap-dialog none" id="updateDesignationDialog">
			<div class="dialog">
				<span class="dialog-title">Cập nhật vị trí<b class="close-dialog effect">x</b></span>
				<div class="dialog-content">
					<h:form id="formUpdateDesignation">
					<table class="input-column w100">
						<tr>
							<td>
								<div class="input-item">
		        					<span class="block required">Tên vị trí <img align="top"
									src="#{facesContext.externalContext.requestContextPath}/resources/images/error.gif" /></span>
		        					<h:inputText styleClass="input w80" value="#{designation.selectedDesignation.name}"
		        					maxlength="100" required="true" requiredMessage="Tên không được để trống"></h:inputText>
		        					<span class="italic block">Tên vị trí không được phép trùng nhau</span>
		        				</div>
							</td>
						</tr>
						<tr>
							<td><h:commandButton styleClass="button green-bt"
							action="#{designation.update}" value="Lưu lại">
							</h:commandButton></td>
						</tr>
					</table>						
					</h:form>
				</div>
			</div>
		</div>
	</ui:define>
</ui:composition>